<template>
  <card>
    <template #title>
      <div class="title-wrap">
        <span>{{ props?.treeSelectedInfo?.fileName }}</span>
      </div>
    </template>
    <!-- <template #more><publish-drawer /></template> -->
    <template #content>
      <a-table />
    </template>
  </card>
</template>
<script setup>
import card from '@/components/card.vue'
import ATable from './table.vue'
import { useProvideContextRegistry, useDbType } from './provide-context.js'
import { toRef, computed, onActivated, onDeactivated, watch, ref } from 'vue'
import { message as Message } from 'ant-design-vue'
import useActivated from '@/hooks/useActivated.js'
import { getFileInfo } from '@/api/db.js'

/**
 * 外部参数
 */
let props = defineProps({
  groupId: { type: String },
  treeSelectedInfo: { type: Object },
  staticPermission: {
    type: Object,
  },
})

let isActivated = useActivated()

// /**
//  * 事件定义
//  */
// let emit = defineEmits(['update:groupId'])
// /**
//  * 双向绑定
//  */
// let groupId = useVModel(props, 'groupId', emit)
let groupId = toRef(props, 'groupId')
let treeSelectedInfo = toRef(props, 'treeSelectedInfo')
// let categoryName = computed(() => treeSelectedInfo.value?.categoryName)
useProvideContextRegistry({
  groupId,
  categoryId: groupId,
  treeSelectedInfo,
  useSearchQueryDataname: true,
  staticPermission: props.staticPermission,
})
</script>
<style scoped lang="less">
.title-wrap {
  display: flex;
  white-space: nowrap;
  align-items: center;
  span {
    margin-right: 12px;
  }
}
</style>
